<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>



<script type="text/javascript" charset="utf-8">
/* Title settings */		
title = "社区居民疾病扇形统计";
titleXpos = 390;
titleYpos = 85;

/* Pie Data */
pieRadius = 130;
pieXpos = 150;
pieYpos = 180;
pieData = [114, 51, 17,50,12,2,15,34,1,6];
pieLegend = [
"%%.%% – 高血压", 
"%%.%% – 冠心病", 
"%%.%% – 慢性阻塞性肺疾病", 
"%%.%% – 恶心肿瘤", 
"%%.%% – 脑卒中", 
"%%.%% – 重性精神病", 
"%%.%% – 结核病", 
"%%.%% – 肝炎", 
"%%.%% – 其他法定成人版", 
"%%.%% – 职业病", 
"%%.%% – 其他"
];

pieLegendPos = "east";

$(function () {
	var r = Raphael("chartHolder");
	 
	r.text(titleXpos, titleYpos, title).attr({"font-size": 20});
	
	var pie = r.piechart(pieXpos, pieYpos, pieRadius, pieData, {legend: pieLegend, legendpos: pieLegendPos});
	pie.hover(function () {
		this.sector.stop();
		this.sector.scale(1.1, 1.1, this.cx, this.cy);
		if (this.label) {
			this.label[0].stop();
			this.label[0].attr({ r: 7.5 });
			this.label[1].attr({"font-weight": 800});
		}
	}, function () {
		this.sector.animate({ transform: 's1 1 ' + this.cx + ' ' + this.cy }, 500, "bounce");
		if (this.label) {
			this.label[0].animate({ r: 5 }, 500, "bounce");
			this.label[1].attr({"font-weight": 400});
		}
	});
	
});
</script>
<div id="chartHolder"></div>
<div class="formBar">
	<ul>
		<li><div class="button"><div class="buttonContent"><button type="button" class="close">返回</button></div></div></li>
	</ul>
</div>
